<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>音乐列表</title>
<style>
  body {
    font-family: Arial, sans-serif;
    margin: 20px;
  }
  h1 {
    text-align: center;
  }
  ul {
    list-style-type: none;
    padding: 0;
  }
  li {
    margin-bottom: 5px;
  }
  .hidden {
    display: none;
  }
</style>
</head>
<body>
<h1>音乐列表</h1>
<ul id="musicList">
  <?php
  // 指定 MP3 文件夹的路径
  $directory = 'MP3';

  // 获取目录中的所有文件
  $files = scandir($directory);

  // 遍历文件列表并创建下载链接
  foreach ($files as $file) {
      // 排除当前目录和父目录
      if ($file != "." && $file != "..") {
          echo "<li>$file</li>";
      }
  }
  ?>
</ul>

<button id="generateTxtButton">下载列表</button>
<button id="downloadTxtButton" class="hidden"></button>

<script>
document.getElementById('generateTxtButton').addEventListener('click', function() {
    var textToWrite = '';
    var musicList = document.getElementById('musicList').getElementsByTagName('li');

    for (var i = 0; i < musicList.length; i++) {
        textToWrite += musicList[i].textContent + '\n';
    }

    var textFileAsBlob = new Blob([textToWrite], { type: 'text/plain' });
    var fileNameToSaveAs = 'music_list.txt';
    var downloadLink = document.createElement('a');
    downloadLink.download = fileNameToSaveAs;
    downloadLink.innerHTML = 'Download File';
    if (window.webkitURL != null) {
        downloadLink.href = window.webkitURL.createObjectURL(textFileAsBlob);
    } else {
        downloadLink.href = window.URL.createObjectURL(textFileAsBlob);
        downloadLink.style.display = 'none';
        document.body.appendChild(downloadLink);
    }
    downloadLink.click();
});

document.getElementById('generateTxtButton').addEventListener('click', function() {
    document.getElementById('downloadTxtButton').classList.remove('hidden');
});
</script>
</body>
</html>
